import 'package:flutter/material.dart';

import 'package:flutter_easyrefresh/easy_refresh.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:freedom_flutter_mall/utils/router_utils.dart';
import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
import 'package:flutter_swiper_view/flutter_swiper_view.dart';
import 'package:freedom_flutter_mall/views/screens/search/search_screen.dart';
import 'package:freedom_flutter_mall/views/widgets/load_image.dart';

class ActualComment {
  final String desc;
  final String img;
  final String name;
  final String address;
  final double rate;
  ActualComment({ required this.desc, required this.img, required this.name, required this.address, required this.rate});
}


class HomeScreen extends StatefulWidget {
  const HomeScreen({super.key});

  @override
  State<HomeScreen> createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {

  List<ActualComment> acList = [
    ActualComment(desc: '西湖边的酒店这样的景观是真的绝了，感受清晨的阳光从…', img: '', name: 'Bella', address: '杭州', rate: 1.0),
    ActualComment(desc: '这样的酒店内饰布局真是爱了呀，入住接机服务也没得说…', img: '', name: '鲨鱼辣子', address: '北京', rate: 1.0),
    ActualComment(desc: '能这样吃个早饭，无论多冷的天我也能早起了，虽然广州…', img: '', name: '糖不理布', address: '广州', rate: 1.0),
    ActualComment(desc: '能这样吃个早饭，无论多冷的天我也能早起了，虽然广州…', img: '', name: '糖不理布', address: '广州', rate: 1.0),
    ActualComment(desc: '能这样吃个早饭，无论多冷的天我也能早起了，虽然广州…', img: '', name: '糖不理布', address: '广州', rate: 1.0),
    ActualComment(desc: '能这样吃个早饭，无论多冷的天我也能早起了，虽然广州…', img: '', name: '糖不理布', address: '广州', rate: 1.0),
    ActualComment(desc: '能这样吃个早饭，无论多冷的天我也能早起了，虽然广州…', img: '', name: '糖不理布', address: '广州', rate: 1.0),
    ActualComment(desc: '能这样吃个早饭，无论多冷的天我也能早起了，虽然广州…', img: '', name: '糖不理布', address: '广州', rate: 1.0),
    ActualComment(desc: '能这样吃个早饭，无论多冷的天我也能早起了，虽然广州…', img: '', name: '糖不理布', address: '广州', rate: 1.0),
    ActualComment(desc: '能这样吃个早饭，无论多冷的天我也能早起了，虽然广州…', img: '', name: '糖不理布', address: '广州', rate: 1.0),
    ActualComment(desc: '能这样吃个早饭，无论多冷的天我也能早起了，虽然广州…', img: '', name: '糖不理布', address: '广州', rate: 1.0),
  ];

  final PageController _pageController = PageController();

  @override
  void dispose() {
    _pageController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: EasyRefresh(
        header: BallPulseHeader(),
        footer: BallPulseFooter(),
        onRefresh: () {
          return Future.value();
        },
        child: SingleChildScrollView(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              _buildBanner(),
              SizedBox(height: 8.w,),
              _buildHandpickBrand(),
              SizedBox(height: 8.w,),
              _buildHotSale(),
              SizedBox(height: 8.w,),
              _buildActualComment(),
              SizedBox(height: 8.w,),
              _buildHotRecommend(),
            ],
          ),
        ),
      ),
    );
  }

  Widget _buildBanner() {
    return Stack(
      children: [
        SizedBox(
          height: 500.w,
          child: Swiper(
            autoplay: true,
            autoplayDelay: 5000,
            itemCount: 5,
            itemBuilder: (context, index){
              return PhysicalModel(
                color: Colors.transparent,
                // borderRadius: BorderRadius.circular(8.w),
                clipBehavior: Clip.antiAlias,
                child: Image.asset("assets/images/home_banner_one.png",
                  height: 420.0.w,
                  fit: BoxFit.fitHeight,
                ),
              );
            },
          ),
        ),
        Positioned(
          top: 30.w,
          right: 18.w,
          child: InkWell(
            onTap: () {
              RouterUtils.toPage(context, const SearchScreen());
            },
            child: LoadAssetImage('home/icon_search', width: 24.w, height: 24.w,),
          ),
        ),
        Positioned(
          bottom: 80.w,
          left: 0.w,
          right: 0.w,
          child: Column(
            children: [
              Text(
                "来会员尊享日赚取百万积分",
                style: TextStyle(
                  fontSize: 20.w,
                  color: const Color.fromRGBO(255, 255, 255, 1),
                  fontWeight: FontWeight.w700,
                ),
              ),
              SizedBox(height: 10.w,),
              Text(
                "万份豪礼等你来取，立即开启夏日旅途",
                style: TextStyle(
                  fontSize: 12.w,
                  color: const Color.fromRGBO(255, 255, 255, 1),
                  fontWeight: FontWeight.w400,
                ),
              ),
            ],
          ),
        ),
      ],
    );
  }

  Widget _buildHandpickBrand() {
    return Container(
      padding: EdgeInsets.symmetric(vertical: 10.w, horizontal: 15.w,),
      decoration: const BoxDecoration(
        color: Color.fromRGBO(255, 255, 255, 1),
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    '品牌列表',
                    style: TextStyle(
                      fontSize: 18.w,
                      color: const Color.fromRGBO(28, 28, 28, 1),
                      fontWeight: FontWeight.w600,
                    ),
                  ),
                  SizedBox(height: 8.w,),
                  Text(
                    '万豪国际集团通过旅享家，带来旗下8个精品酒店品牌',
                    style: TextStyle(
                      fontSize: 12.w,
                      color: const Color.fromRGBO(127, 127, 127, 1),
                      fontWeight: FontWeight.w400,
                    ),
                  ),
                ],
              ),
              Text.rich(
                TextSpan(
                    text: '1',
                    style: TextStyle(
                      fontSize: 14.w,
                      color: const Color.fromRGBO(28, 28, 28, 1),
                      fontWeight: FontWeight.w600,
                    ),
                    children: [
                      TextSpan(
                        text: '/8',
                        style: TextStyle(
                          fontSize: 10.w,
                          color: const Color.fromRGBO(28, 28, 28, 1),
                          fontWeight: FontWeight.w400,
                        ),
                      ),
                    ]
                ),
              ),
            ],
          ),
          SizedBox(height: 10.w,),
          SizedBox(
            height: 220.w,
            child: GridView.count(
              mainAxisSpacing: 10.w,
              crossAxisSpacing: 8.w,
              crossAxisCount: 2,
              scrollDirection: Axis.horizontal,
              children: List.generate(8, (index) {
                return Column(
                  children: [
                    Container(
                      height: 68.w,
                      width: 115.w,
                      padding: EdgeInsets.symmetric(vertical: 13.w, horizontal: 30.w),
                      decoration: const BoxDecoration(
                        color: Color.fromRGBO(250, 250, 251, 1),
                      ),
                      child: LoadAssetImage('home/brand_1', width: 24.w, height: 24.w,),
                    ),
                    SizedBox(height: 8.w,),
                    Text(
                      '万豪',
                      style: TextStyle(
                        fontSize: 12.w,
                        color: const Color.fromRGBO(28, 28, 28, 1),
                        fontWeight: FontWeight.w600,
                      ),
                    ),
                  ],
                );
              }),
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildHotRecommend() {
    return Container(
      padding: EdgeInsets.symmetric(vertical: 10.w, horizontal: 15.w,),
      decoration: const BoxDecoration(
        color: Color.fromRGBO(255, 255, 255, 1),
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            '热卖推荐',
            style: TextStyle(
              fontSize: 18.w,
              color: const Color.fromRGBO(28, 28, 28, 1),
              fontWeight: FontWeight.w600,
            ),
          ),
          SizedBox(height: 8.w,),
          GridView.builder(
            padding: EdgeInsets.zero,
            itemCount: acList.length,
            shrinkWrap: true,
            physics: const NeverScrollableScrollPhysics(),
            gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
              childAspectRatio: 157 / 240,
              crossAxisSpacing: 10,
              mainAxisSpacing: 10,
              crossAxisCount: 2,
            ),
            itemBuilder: (context, index) {
              return GestureDetector(
                onTap: () {

                },
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.start,
                  children: [
                    LoadAssetImage(
                      "home/who-270436-DESIGN-High",
                      height: 186.w,
                      fit: BoxFit.cover,
                    ),
                    SizedBox(height: 5.w,),
                    Text(
                      '万豪床垫',
                      style: TextStyle(
                        fontSize: 12.w,
                        fontWeight: FontWeight.w400,
                        color: const Color.fromRGBO(28, 28, 28, 1),
                      ),
                    ),
                    SizedBox(height: 5.w,),
                    Text.rich(
                        TextSpan(
                            text: '￥11800起',
                            style: TextStyle(
                              fontSize: 12.w,
                              fontWeight: FontWeight.w600,
                              color: const Color.fromRGBO(255, 150, 98, 1),
                            ),
                            children: [
                              TextSpan(
                                text: '￥13100起',
                                style: TextStyle(
                                  decoration: TextDecoration.lineThrough,
                                  fontSize: 10.w,
                                  fontWeight: FontWeight.w600,
                                  color: const Color.fromRGBO(127, 127, 127, 1),
                                ),
                              ),
                            ]
                        )
                    ),
                    SizedBox(height: 5.w,),
                    Row(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        Container(
                          padding: EdgeInsets.symmetric(vertical: 3.w, horizontal: 5.w),
                          decoration: const BoxDecoration(
                            color: Color.fromRGBO(255, 232, 220, 1),
                          ),
                          child: Text(
                            "全场九折",
                            // overflow: TextOverflow.ellipsis,
                            maxLines: 1,
                            style: TextStyle(
                              fontSize: 8.w,
                              fontWeight: FontWeight.w500,
                              color: const Color.fromRGBO(255, 150, 98, 1),
                            ),
                          ),
                        ),
                        SizedBox(width: 5.w,),
                        Container(
                          padding: EdgeInsets.symmetric(vertical: 3.w, horizontal: 5.w),
                          decoration: const BoxDecoration(
                            color: Color.fromRGBO(244, 244, 244, 1),
                          ),
                          child: Text(
                            "尺寸可选",
                            // overflow: TextOverflow.ellipsis,
                            maxLines: 1,
                            style: TextStyle(
                              fontSize: 8.w,
                              fontWeight: FontWeight.w500,
                              color: const Color.fromRGBO(127, 127, 127, 1),
                            ),
                          ),
                        ),
                      ],
                    ),
                  ],
                ),
              );
            },
          ),
        ],
      ),
    );
  }

  Widget _buildActualComment() {
    return Container(
      padding: EdgeInsets.symmetric(vertical: 10.w, horizontal: 15.w,),
      decoration: const BoxDecoration(
        color: Color.fromRGBO(255, 255, 255, 1),
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            '万豪体验官酒店实评',
            style: TextStyle(
              fontSize: 18.w,
              color: const Color.fromRGBO(28, 28, 28, 1),
              fontWeight: FontWeight.w600,
            ),
          ),
          SizedBox(height: 20.w,),
          StaggeredGrid.count(
            crossAxisCount: 2,
            mainAxisSpacing: 2,
            crossAxisSpacing: 10,
            children: List.generate(10, (index) {
              var isMin = true;
              if (index.isEven) {
                isMin = false;
              }
              return _buildActualCommentContext(isMin);
            }).toList(),
          ),
          InkWell(
            onTap: () {},
            child: Container(
              alignment: Alignment.center,
              margin: EdgeInsets.symmetric(horizontal: 24.w, vertical: 10.w,),
              height: 42.w,
              decoration: const BoxDecoration(
                color: Color.fromRGBO(246, 246, 246, 1),
              ),
              child: Text(
                '查看更多实评  >',
                style: TextStyle(
                  fontSize: 12.w,
                  fontWeight: FontWeight.w500,
                  color: const Color.fromRGBO(28, 28, 28, 1),
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildActualCommentContext(isMin) {
    return StaggeredGridTile.count(
        crossAxisCellCount: 1,
        mainAxisCellCount: !isMin ? 1.12 : 1.91,
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            isMin ? LoadAssetImage('home/whoHKGWHls', fit: BoxFit.cover,) : LoadAssetImage('home/who-270436-DESIGN-High', fit: BoxFit.cover,),
            SizedBox(height: 8.w,),
            Text(
              'W酒店这样的景观真的上海仅此一家，超级喜欢他们的早…',
              style: TextStyle(
                fontSize: 12.w,
                color: const Color.fromRGBO(28, 28, 28, 1),
                fontWeight: FontWeight.w400,
              ),
            ),
            SizedBox(height: 10.w,),
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Row(
                  children: [
                    Container(
                      width: 20.w,
                      height: 20.w,
                      decoration: BoxDecoration(
                        image: DecorationImage(
                          fit: BoxFit.cover,
                          image: NetworkImage("https://img.js.design/assets/img/62c2af5112e410e8b0fe489e.png"),
                        ),
                        borderRadius: BorderRadius.circular(20.w),
                      ),
                    ),
                    SizedBox(width: 8.w,),
                    Text(
                      'W酒店这',
                      style: TextStyle(
                        fontSize: 12.w,
                        color: const Color.fromRGBO(28, 28, 28, 1),
                        fontWeight: FontWeight.w400,
                      ),
                    ),
                  ],
                ),
                Text(
                  '上海',
                  style: TextStyle(
                    fontSize: 12.w,
                    color: const Color.fromRGBO(127, 127, 127, 1),
                    fontWeight: FontWeight.w400,
                  ),
                ),
              ],
            ),
          ],
        )
    );
  }

  Widget _buildHotSale() {
    return Container(
      padding: EdgeInsets.symmetric(vertical: 10.w, horizontal: 15.w,),
      decoration: const BoxDecoration(
        color: Color.fromRGBO(255, 255, 255, 1),
      ),
      child: Column(
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    '旅享热卖',
                    style: TextStyle(
                      fontSize: 18.w,
                      color: const Color.fromRGBO(28, 28, 28, 1),
                      fontWeight: FontWeight.w600,
                    ),
                  ),
                  SizedBox(height: 8.w,),
                  Text(
                    '新色新品床垫及W酒店新工艺床架，惊喜上线限时9折',
                    style: TextStyle(
                      fontSize: 12.w,
                      color: const Color.fromRGBO(127, 127, 127, 1),
                      fontWeight: FontWeight.w400,
                    ),
                  ),
                ],
              ),
              Text.rich(
                TextSpan(
                    text: '1',
                    style: TextStyle(
                      fontSize: 14.w,
                      color: const Color.fromRGBO(28, 28, 28, 1),
                      fontWeight: FontWeight.w600,
                    ),
                    children: [
                      TextSpan(
                          text: '/4',
                          style: TextStyle(
                            fontSize: 10.w,
                            color: const Color.fromRGBO(28, 28, 28, 1),
                            fontWeight: FontWeight.w400,
                          ),
                      ),
                    ]
                ),
              ),
            ],
          ),
          SizedBox(height: 10.w,),
          SizedBox(
            height: 263.w,
            child: ListView.builder(
              shrinkWrap: true,
              itemCount: 10,
              physics: const BouncingScrollPhysics(),
              scrollDirection: Axis.horizontal,
              itemBuilder: (BuildContext context, int index) {
                return GestureDetector(
                  onTap: () {

                  },
                  child: Container(
                    width: 327.w,
                    padding: EdgeInsets.fromLTRB(0, 0, 10, 0),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        LoadAssetImage('home/RS3569',
                          width: 327.w,
                          height: 194.w,
                          fit: BoxFit.cover,
                        ),
                        SizedBox(height: 8.w,),
                        Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Text('万豪酒店床垫',
                              style: TextStyle(
                                fontSize: 14.w,
                                fontWeight: FontWeight.w400,
                                color: const Color.fromRGBO(28, 28, 28, 1),
                              ),
                            ),
                            Text.rich(
                              TextSpan(
                                  text: '¥11800',
                                  style: TextStyle(
                                    fontSize: 12.w,
                                    color: const Color.fromRGBO(255, 150, 98, 1),
                                    fontWeight: FontWeight.w600,
                                  ),
                                  children: [
                                    TextSpan(
                                      text: '¥13100',
                                      style: TextStyle(
                                        fontSize: 10.w,
                                        color: const Color.fromRGBO(127, 127, 127, 1),
                                        fontWeight: FontWeight.w500,
                                      ),
                                    ),
                                  ]
                              ),
                            ),
                          ],
                        ),
                        SizedBox(height: 4.w,),
                        Text('无需入住酒店，在家也能日日享受安逸睡眠',
                          style: TextStyle(
                            fontSize: 12.w,
                            fontWeight: FontWeight.w400,
                            color: const Color.fromRGBO(127, 127, 127, 1),
                          ),
                        ),
                        SizedBox(height: 4.w,),
                        Container(
                          width: 40.w,
                          height: 16.w,
                          padding: EdgeInsets.symmetric(vertical: 2.w, horizontal: 5.w),
                          decoration: const BoxDecoration(
                            color: Color.fromRGBO(255, 232, 220, 1),
                          ),
                          child: Text('全场9折',
                            style: TextStyle(
                              fontSize: 8.w,
                              fontWeight: FontWeight.w500,
                              color: const Color.fromRGBO(255, 150, 98, 1),
                            ),
                          ),
                        )
                      ],
                    ),
                  )
                );
              },
            ),
          )
        ],
      ),
    );
  }
}


